<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>幸运大转盘</title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link rel="stylesheet" type="text/css" href="http://s10.realdtech.com/xws/house-richer/big-wheel/css/style.css"/>
	</head>

	<body class="wheel">
		<div class="wheel-bg">
			<!--这是顶级的差号，点击的时候会返回到主游戏-->
			<a class="skip_btn" id="zhuye" >
				<img src="http://s10.realdtech.com/xws/house-richer/big-wheel/img/close-btn.png">
			</a>
			<div class="wheel-out">
				<p>今日剩余次数:<span class="nump">#(btcnum.big_turn_chance??)</span>次</p>
				<img src="http://s10.realdtech.com/xws/house-richer/big-wheel/img/wheel-outer.png" id="outBg">
				<img src="http://s10.realdtech.com/xws/house-richer/big-wheel/img/wheel-inner.png" id="innerWheel">
				<img src="http://s10.realdtech.com/xws/house-richer/big-wheel/img/wheel-btn.png" id="wheelBtn">
				<img src="http://s10.realdtech.com/xws/house-richer/big-wheel/img/wheel-bottom.png" id="wheelBottom">	
			</div>
			<div class="rule-btn"></div>
		</div>
		<!--游戏规则-->
		<div class="rule-bg">
			<div class="close-rulebtn">
				<img src="http://s10.realdtech.com/xws/house-richer/big-wheel/img/close-btn.png">
			</div>
			<div class="rule">
				<img src="http://s10.realdtech.com/xws/house-richer/big-wheel/img/rule.png">
			</div>
			<a class="start-btn">
			</a>
		</div>
		<div class="mask">
			<div class="no-times">
				<img src="http://s10.realdtech.com/xws/house-richer/big-wheel/img/alert-closebtn.png" class="close-img">
				<img src="http://s10.realdtech.com/xws/house-richer/big-wheel/img/no-times.png">
			</div>
		</div>
		
		<div class="alert" style="display:none;">
			<!--中奖页面-->
			<div class="alert-con" >
				<a class="skip_btn close-btn" href="javascript:void(0)">
					<img src="http://s10.realdtech.com/xws/house-richer/big-wheel/img/close-btn.png">
				</a>
				<div class="alert-content">
					<img src="http://s10.realdtech.com/xws/house-richer/big-wheel/img/prize-bg.png" class="alert-bg">
					<div class="alert-words">
						<p>中奖了！！！</p>
						<p>恭喜你获得价值<span class="valuep"></span>元的<span  class="namep" class="prize-name"></span>奖品一份</p>
						<div class="code">
							<p>中奖编码：</p><p><span class="nop"></span></p>
						</div>
						<p>兑奖方式可在"我的奖品"中查看</p>
						<p>请幸运的你,在规定时间到指定地点,</p>
						<p>领取你的专属奖品</p>
						<a href="/wxcs/myPrize" class="myprize-btn">
						</a>
					</div>
				</div>
			</div>
			<!--中奖掷筛子-->
			<div class="alert-con" style="display:none;">
				<a class="skip_btn close-btn" href="javascript:void(0)">
					<img src="http://s10.realdtech.com/xws/house-richer/big-wheel/img/close-btn.png">
				</a>
				<div class="alert-content">
					<img src="http://s10.realdtech.com/xws/house-richer/big-wheel/img/prize-bg.png" class="alert-bg">
					<div class="alert-words">
						<p>哎呦！手气不错哦</p>
						<p>恭喜你额外获得一次掷骰子机会</p>
						<img src="http://s10.realdtech.com/xws/house-richer/big-wheel/img/than20-score2.png" class="shaizi">
						<p>来吧</p>
						<p>请开始你的掷骰子表演</p>
						<a href="" class="myprize-btn">
						</a>
					</div>
				</div>
			</div>
			<!--未中奖弹框-->
			<div class="alert-con"  style="display:none;">
				<a class="skip_btn close-btn" href="javascript:void(0)">
					<img src="http://s10.realdtech.com/xws/house-richer/big-wheel/img/close-btn.png">
				</a>
				<div class="alert-content">
					<img src="http://s10.realdtech.com/xws/house-richer/big-wheel/img/noprize-bg.png" class="alert-bg">
					<div class="alert-words">
						<img src="http://s10.realdtech.com/xws/house-richer/big-wheel/img/icon6.png" class="alert-icon6">
					</div>
				</div>
			</div>
			<div class="alert-con"  style="display:none;">
				<a class="skip_btn close-btn" href="javascript:void(0)">
					<img src="http://s10.realdtech.com/xws/house-richer/big-wheel/img/close-btn.png">
				</a>
				<div class="alert-content">
					<img src="http://s10.realdtech.com/xws/house-richer/big-wheel/img/noprize-bg.png" class="alert-bg">
					<div class="alert-words">
						<p>点儿背不能赖社会</p>
						<p>那你让我赖谁？</p>
						<p>我就不信</p>
						<p>明日点儿还这么背</p>
						<img src="http://s10.realdtech.com/xws/house-richer/big-wheel/img/icon7.png" class="alert-icon7">
					</div>
				</div>
			</div>
			<div class="alert-con"  style="display:none;">
				<a class="skip_btn close-btn" href="javascript:void(0)">
					<img src="http://s10.realdtech.com/xws/house-richer/big-wheel/img/close-btn.png">
				</a>
				<div class="alert-content">
					<img src="http://s10.realdtech.com/xws/house-richer/big-wheel/img/no-prize.png" class="alert-bg">
					<div class="alert-words">
						<p>承认吧，这是一个看手气的世界</p>
						<p>该奖品，虽今日已被领完</p>
						<p>但你<i>明天</i>还可以<i>再来</i>啊！</p>
						<img src="http://s10.realdtech.com/xws/house-richer/big-wheel/img/icon8.png" class="alert-icon8">
					</div>
				</div>
			</div>
		</div>
	</body>
	<script src="http://s10.realdtech.com/xws/house-richer/big-wheel/js/jquery-2.1.0.js"></script>
	<script src="http://s10.realdtech.com/xws/house-richer/big-wheel/js/jquery.rotate.min.js"></script>
	<script src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
	<script>

		/*点击主要的差号返回主游戏页面
		* 返回上一页
		* */
        $('#zhuye').click(function () {
            //这个是返回上一页貌似体验不好
//            window.history.back(-1);
			window.location.href='/wxcs?shuju=1'
        });

        /**
         * 微信接口权限
         */
        wx.config({
            debug: false,
            appId: "#(appId??)", // 必填，公众号的唯一标识
            timestamp: "#(timestamp??)", // 必填，生成签名的时间戳
            nonceStr: "#(nonceStr??)", // 必填，生成签名的随机串
            signature: "#(signature??)", // 必填，签名，见附录1
            jsApiList: [					// 必填，需要使用的JS接口列表
                'onMenuShareTimeline',
                'onMenuShareAppMessage',
                'hideMenuItems'
            ]
        });

        /**
         * 分享配置
         */
        wx.ready(function() {
            //分享的图片
            var imgUrl = 'http://reald.oss-cn-beijing.aliyuncs.com/authentication_files//2c918081600ff35301602ff6005a0004';
            //直接写微信网址无法识别
            //var link='http://www.daxiangdai.cn/dxd/dial/wx';
            var link='http://chengdong4.tunnel.echomod.cn/big/wx';
            /**
             * 朋友圈
             */
            wx.onMenuShareTimeline({
                title: '幸运大转盘丨让我们一起转起来！', // 分享标题
                desc: '我想和你一起中奖！', // 分享描述
                link : link, // 分享链接
                imgUrl: imgUrl,// 分享图标
                //用户点击分享按钮执行
                trigger: function (res) {
                    //用户点击分享按钮后会执行ajax访问后台并根据openid来对用户增加抽奖次数。
                    $.ajax({
                        async : false,
                        url:"/big/share",
                        type:"post",
                        data:{
                            "openid":"#(openid??)"
                        },
                        success: function(data) {
                            playnum = data.lotteryTime;
                            //alert("成功");
                        },
                        error: function() {
                            //alert("失败");
                        }
                    });
                },
            });
            /**
             *  好友
             */
            wx.onMenuShareAppMessage({
                title: '幸运大转盘丨让我们一起转起来！', // 分享标题
                desc: '我想和你一起中奖！', // 分享描述
                link : link, // 分享链接
                imgUrl: imgUrl,
                //用户点击分享按钮执行
                trigger: function (res) {
                    //用户点击分享按钮后会执行ajax访问后台并根据openid来对用户增加抽奖次数。
                    $.ajax({
                        async : false,
                        url:"/big/share",
                        type:"post",
                        data:{
                            "openid":"#(openid??)"
                        },
                        success: function(data) {
                            playnum = data.lotteryTime;
                            console.log("playnum: "+playnum)
                            //alert(playnum);
                        },
                        error: function() {
                            //alert("失败");
                        }
                    });
                },
            });
            wx.hideMenuItems({
                menuList: [
                    'menuItem:share:appMessage'//隐藏分享到朋友按钮
                ],
                success: function (res) {
                    //alert("关闭");
                },
                fail: function (res) {
                    //alert("关闭失败")
                }
            });
        });

		$(function() {
		var $btn = $('#wheelBtn');
		var $inner = $('#innerWheel');
		var playnum = #(btcnum.big_turn_chance??); //初始次数，由后台传入
		var isture = 0;
		var dataa;
		var still;
		$(".close-img").on("click",function(){
			$(".mask").hide();
		});
		var clickfunc = function() {
			if(dataa == 16){
				rotateFuncNoPrize(1, 0);
			}else if(dataa == 7){
				rotateFuncDish(2, 36);
			}else if(dataa == 8){
				rotateFuncPlants(3, 72);
			}else if(dataa == 9){
				rotateFuncDecorate(4, 108);
			}else if(dataa == 10){
				rotateFuncFurniture(5, 144);
			}else if(dataa == 11){
				rotateFuncFitment(6, 180);
			}else if(dataa == 12){
				rotateFuncRings(7, 216);
			}else if(dataa == 13){
				rotateFuncFitness(8, 252);
			}else if(dataa == 14){
				rotateFuncRedpaper(9, 288);
			}else if(dataa == 15){
				rotateFuncThrowdice(10, 324);
			}
		}

		wheelBtn.onclick=function run() {
            if(playnum <= 0) {
                $(".mask").show();
                isture = false;
            }else{
                $.ajax({
                    url: "/big/startGame?userId=#(btcuser??)",
                    type: "post",
                    dataType: 'json',
                    success: function (data) {

                        if(isture) return;
                        isture = true;
                        dataa = data.rand;
                        playnum = data.btcnum;
                        still = data.nump;
                        $(".nump").html(playnum);
                        if(playnum == 0){
                            $(".mask").show();
						}else {
                            $(".valuep").html(data.valuep);
                            $(".namep").html(data.namep);
                            $(".nop").html(data.nop);
                            clickfunc();
						}
                    }
                });
            }
		    wheelBtn.onclick = null;
		    clearTimeout(timer);
		    var timer = setTimeout(function(){
		        wheelBtn.onclick = run;
		    },4000);
		};
		var rotateFuncNoPrize = function(awards, angle) {
			isture = true;
			$inner.stopRotate();
			$inner.rotate({
				angle: 0,
				duration: 4000,
				animateTo: angle + 1440,
				callback: function() {
					isture = false;
					$(".alert").show();
					var random = Math.random();
					if(random < 0.6){
						$(".alert-con").eq(2).show().siblings().hide();
					}else{
						$(".alert-con").eq(3).show().siblings().hide();
					}
					
				}
			});
		};
		//获取美食卡
		var rotateFuncDish = function(awards, angle) {
			isture = true;
			$inner.stopRotate();
			$inner.rotate({
				angle: 0,
				duration: 4000,
				animateTo: angle + 1440,
				callback: function() {
					isture = false;
					if(still == 0){
                        $(".alert").show();
                        $(".alert-con").eq(4).show().siblings().hide();
					}else {
                        $(".alert").show();
                        $(".alert-con").eq(0).show().siblings().hide();
                        $(".prize-name").html("美食卡");
					}
				}
			});
		};
		//绿植
		var rotateFuncPlants = function(awards, angle) {
			isture = true;
			$inner.stopRotate();
			$inner.rotate({
				angle: 0,
				duration: 4000, //旋转时间
				animateTo: angle + 1440, //让它根据得出来的结果加上1440度旋转
				callback: function() {
					isture = false; // 标志为 执行完毕
                    if(still == 0){
                        $(".alert").show();
                        $(".alert-con").eq(4).show().siblings().hide();
                    }else {
                        $(".alert").show();
                        $(".alert-con").eq(0).show().siblings().hide();
                        $(".prize-name").html("绿植");
                    }
				}
			});
		};
		//装饰礼品
		var rotateFuncDecorate = function(awards, angle) {
			isture = true;
			$inner.stopRotate();
			$inner.rotate({
				angle: 0,
				duration: 4000, //旋转时间
				animateTo: angle + 1440, //让它根据得出来的结果加上1440度旋转
				callback: function() {
					isture = false; // 标志为 执行完毕
                    if(still == 0){
                        $(".alert").show();
                        $(".alert-con").eq(4).show().siblings().hide();
                    }else {
                        $(".alert").show();
                        $(".alert-con").eq(0).show().siblings().hide();
                        $(".prize-name").html("装饰礼品");
                    }
				}
			});
		};
		//家具奖励券
		var rotateFuncFurniture = function(awards, angle) {
			isture = true;
			$inner.stopRotate();
			$inner.rotate({
				angle: 0,
				duration: 4000, //旋转时间
				animateTo: angle + 1440, //让它根据得出来的结果加上1440度旋转
				callback: function() {
					isture = false; // 标志为 执行完毕
                    if(still == 0){
                        $(".alert").show();
                        $(".alert-con").eq(4).show().siblings().hide();
                    }else {
                        $(".alert").show();
                        $(".alert-con").eq(0).show().siblings().hide();
                        $(".prize-name").html("家具奖励劵");
                    }
				}
			});
		};
		//装修礼包
		var rotateFuncFitment = function(awards, angle) {
			isture = true;
			$inner.stopRotate();
			$inner.rotate({
				angle: 0,
				duration: 4000, //旋转时间
				animateTo: angle + 1440, //让它根据得出来的结果加上1440度旋转
				callback: function() {
					isture = false; // 标志为 执行完毕
                    if(still == 0){
                        $(".alert").show();
                        $(".alert-con").eq(4).show().siblings().hide();
                    }else {
                        $(".alert").show();
                        $(".alert-con").eq(0).show().siblings().hide();
                        $(".prize-name").html("装修礼包");
                    }
				}
			});
		};
		//情侣对戒
		var rotateFuncRings = function(awards, angle) {
			isture = true;
			$inner.stopRotate();
			$inner.rotate({
				angle: 0,
				duration: 4000, //旋转时间
				animateTo: angle + 1440, //让它根据得出来的结果加上1440度旋转
				callback: function() {
					isture = false; // 标志为 执行完毕
                    if(still == 0){
                        $(".alert").show();
                        $(".alert-con").eq(4).show().siblings().hide();
                    }else {
                        $(".alert").show();
                        $(".alert-con").eq(0).show().siblings().hide();
                        $(".prize-name").html("情侣对戒");
                    }
				}
			});
		};
		//健身卡
		var rotateFuncFitness = function(awards, angle) {
			isture = true;
			$inner.stopRotate();
			$inner.rotate({
				angle: 0,
				duration: 4000, //旋转时间
				animateTo: angle + 1440, //让它根据得出来的结果加上1440度旋转
				callback: function() {
					isture = false; // 标志为 执行完毕
                    if(still == 0){
                        $(".alert").show();
                        $(".alert-con").eq(4).show().siblings().hide();
                    }else {
                        $(".alert").show();
                        $(".alert-con").eq(0).show().siblings().hide();
                        $(".prize-name").html("健身卡");
                    }
				}
			});
		};
		//红包
		var rotateFuncRedpaper = function(awards, angle) {
			isture = true;
			$inner.stopRotate();
			$inner.rotate({
				angle: 0,
				duration: 4000, //旋转时间
				animateTo: angle + 1440, //让它根据得出来的结果加上1440度旋转
				callback: function() {
					isture = false; // 标志为 执行完毕
                    if(still == 0){
                        $(".alert").show();
                        $(".alert-con").eq(4).show().siblings().hide();
                    }else {
                        $(".alert").show();
                        $(".alert-con").eq(0).show().siblings().hide();
                        $(".prize-name").html("红包");
                    }
				}
			});
		};
		//再掷骰子
		var rotateFuncThrowdice = function(awards, angle) {
			isture = true;
			$inner.stopRotate();
			$inner.rotate({
				angle: 0,
				duration: 4000, //旋转时间
				animateTo: angle + 1440, //让它根据得出来的结果加上1440度旋转
				callback: function() {
					isture = false; // 标志为 执行完毕
					$(".alert").show();
					$(".alert-con").eq(1).show().siblings().hide();
				}
			});
		};
		//关闭弹窗按钮
		$(".close-btn").on("click",function(){
			$(".alert").hide();
		});
		$(".close-rulebtn").on("click",function(){
			$(".rule-bg").hide();
		});
		
		//点击游戏规则
		$(".rule-btn").on("click",function(){
			$(".rule-bg").show();
		});
		$(".start-btn").on("click",function(){
			$(".rule-bg").hide();
		});
	});
	</script>
</html>
